<!DOCTYPE html>
<html>
<head>
    <title><%=title%></title>
    <% include common/top.html %>
    <link rel='stylesheet' href='/pc/css/shopList.css'/>
    <script src='/pc/js/shopList.js'></script>
</head>
<body>
<!--大部分页面基于前端渲染，对于少数使用后端渲染页面的时候，配置partials，同时在这边引入content部分-->
    <% include common/header.html %>
    <div class="content container"  v-cloak>
        <div class="row">
            <div class="location col-xs-6">
                <span>当前位置：</span>
                <span class="location_current">
                    <template v-if="address">
                        {{address}}
                    </template>
                    <template v-else>
                        你还没有选择你的位置~
                    </template>
                </span>

            </div>
            <div class="location_change col-xs-6">
                <form class="form-inline" id="location_form">
                    <div class="input-group" >
                        <input class="form-control" name="address">
                        <div class="input-group-addon search_btn" @click="locationChange">
                            <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <div class="sort_select">
            排序：
            <button class="btn btn-primary" @click="sortDefault"> 默认排序</button>
            <button class="btn" @click="sortPrice"> 起送金额排序</button>
        </div>
        <div class="place_tips">
            附近有
            <var>{{shop.length}} 家</var>
            店铺，享受美食吧！
        </div>
        <div class="shop_list clearfix">

            <div class="item" v-for="shop in shop" @click="goLink(shop._id)">
                <h3 class="item_title">{{shop.shop_name}}</h3>
                <p><small>---{{shop.shop_desc}}</small></p>
                <p><small>地址：{{shop.address}}</small></p>
                <p> <small>起送金额：{{shop.least_price_send|currency}}元</small></p>
            </div>
        </div>

    </div>
</body>
</html>